@import '@/common/css/variables.less';
/*************** 重置样式 ***************/
/* H5 */
html {font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;-webkit-text-size-adjust: 100% !important;-webkit-tap-highlight-color:transparent;-webkit-user-select: none;user-select:none;}
body {color: @text-color;-webkit-overflow-scrolling: touch;}
html,body{width:100%;height: 100%;background: #fff;}
* {margin: 0;padding: 0;box-sizing: border-box;}
button{border: none;background: none;line-height: unset;}
button::after{display: none;}

/* 小程序 */
view,scroll-view,cover-view,text,input,textarea,button{margin: 0;padding: 0;box-sizing: border-box;}

/* 隐藏滚动条 */
::-webkit-scrollbar { width: 0; height: 0; color: transparent;}

/* 清除浮动 */
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.clearfix{zoom:1;}

/*************** 页面、文本、字体 ***************/

/* 页面的安全滚动区域,110rpx底部导航的高度 */
.page{width:100%;height: calc(100vh - constant(safe-area-inset-bottom));height: calc(100vh - env(safe-area-inset-bottom));overflow-x: hidden;color: @text-color;padding-bottom: 60rpx;}
.page-bottom-bar{height: calc(100vh - 110rpx - constant(safe-area-inset-bottom));height: calc(100vh - 110rpx - env(safe-area-inset-bottom));}

/* 预留出安全距离 */
.safe-all{
	padding-top: constant(safe-area-inset-top);padding-top: env(safe-area-inset-bottom);/* 导航栏+状态栏的高度 88px */
	padding-left: constant(safe-area-inset-left);padding-left: env(safe-area-inset-left);/* 如果未竖屏时为0 */
	padding-right: constant(safe-area-inset-right);padding-right: env(safe-area-inset-right);/* 如果未竖屏时为0 */
	padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);/* 底下圆弧的高度 34px */
}

/* 当设置width:100%，height: 100%;被设置元素的宽高是按照父元素的宽高来设置，
但是100vw，100vh是相对于屏幕可见宽高来设置的，所以会出现50vw 比50%大的情况 */
.w100{width: 100%;}
.h100{height: 100%;}
.xhidden{overflow-x: hidden;}
.yscroll{overflow-y: scroll;}

/* 文本设置 */
.tl{text-align: left;}
.tc{text-align: center;}
.tr{text-align: right;}
.fl{float: left;}
.fr{float: right;}
.wordbreak{word-break: break-all;}
.ellipsis{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.mutiple-ellipsis{overflow: hidden;word-break: break-all;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.mutiple-ellipsis-2{-webkit-line-clamp: 2;}
.mutiple-ellipsis-3{-webkit-line-clamp: 3;}

/* 字体设置 */
.font30{font-size: 60rpx;}
.font25{font-size: 50rpx;}
.font20{font-size: 40rpx;}
.font18{font-size: 36rpx;}
.font17{font-size: 34rpx;}
.font16{font-size: 32rpx;}
.font15{font-size: 30rpx;}
.font14{font-size: 28rpx;}
.font13{font-size: 26rpx;}
.font12{font-size: 24rpx;}
.font11{font-size: 22rpx;}
.font10{font-size: 20rpx;}
.font9{font-size: 18rpx;}

.font-ffffff{color: #ffffff;}
.font-1e1e1e{color: #1e1e1e;}
.font-999999{color: #999999;}
.font-505050{color: #505050;}
.font-969696{color: #969696;}
.font-646464{color: #646464;}
.font-666666{color: #666666;}
.font-323232{color: #323232;}
.font-ff3c37{color: #ff3c37;}
.font-ff6428{color: #ff6428;}
.font-text{color: @text-color;}
.font-theme{color: @theme-color;}
.font-assist{color: @assist-color;}
.font-link{color: @link-color;}

.font-line{text-decoration: line-through;}
.font-b{font-weight: bold;}

.letter1{letter-spacing: 2rpx;text-indent: 2rpx;}

/*************** 间距、布局 ***************/
/* 间距 */
.hr7{width: 100%;height: 14rpx;background: #f5f5f5;}
.hr10{width: 100%;height: 20rpx;background: #f5f5f5;}

.pb60{padding-bottom: 60rpx;}

/* 布局flex */
.flex-row-between{display: -webkit-flex;display: flex;justify-content: space-between;align-items: center;}
.flex-row-around{display: -webkit-flex;display: flex;justify-content: space-around;align-items: center;}
.flex-row-center{display: -webkit-flex;display: flex;justify-content: center; align-items: center;}
.flex-row-start{display: -webkit-flex;display: flex;justify-content: flex-start; align-items: center;}
.flex-row-end{display: -webkit-flex;display: flex;justify-content: flex-end; align-items: center;}
.flex-column-between{display: -webkit-box;display: flex;flex-direction: column;justify-content: space-between;}
.flex-column-center{display: -webkit-box;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.flex-1{flex: 1;}
.flex-wrap{flex-wrap: wrap;}
.flex-start{align-items: flex-start;}
.flex-center{align-items: center;}

/*************** 页面共享样式 ***************/
/* 背景图 */
.bg-cover{overflow: hidden; background-position: center center;background-repeat: no-repeat;background-size: cover;}

/* placeholder的默认样式 */
.placeholderClass{color: #c8c8c8;}

/* 暂无数据、异常界面 */
.no_data{font-size: 28rpx;text-align: center;padding: 30rpx 0;color: #969696;}

/* mobile-calendar-range */
.calendar-box{width: 750rpx;height: 1000rpx;}
.calendar-submit{width: 600rpx;height: 76rpx;border-radius: 38rpx;background-color: @theme-color;margin: 30rpx auto;}

/* 底部悬浮的按钮（1个长按钮） */
.fix-bottom-btn{
	position: fixed;bottom: 0;left: 0;right: 0;height: 110rpx;background: #faf9f9;border-top: 2rpx solid #eeeeee;padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);box-sizing: content-box;
	.btn{width: 600rpx;height: 76rpx;border-radius: 38rpx;background-color: @theme-color;}
}

/* 筛选条 */
.filter-bar{
	background-color: #fff;margin-bottom: 20rpx;height: 72rpx;display: flex;justify-content: space-around;align-items: center;
	.item{line-height: 72rpx;font-size: 26rpx;color: #666;position: relative;}
	.active{color: @theme-color;font-weight: bold;}
	.active::after{display: block;content: " ";width: 100%;height: 4rpx;background-color: @theme-color;border-radius: 4rpx;position: absolute;bottom: 0; left: 50%;transform: translateX(-50%);}
}

/* 阴影框 */
.box-shadow{width: 700rpx; margin: 20rpx auto 0; background-color: #fff;box-shadow: 0 0 30rpx rgba(0,0,0,.1);border-radius: 10rpx;}

/* 复选框 */
.check-box{
	.inner{
		width: 32rpx;height: 32rpx;margin-right: 20rpx; border-radius: 6rpx;border: 2rpx solid @theme-color;background-color: #fff;
		display: -webkit-flex;display: flex;justify-content: center; align-items: center;
		&::after{
			width: 8rpx;height: 14rpx;border: 2rpx solid #fff;border-top: 0;border-left: 0;content: ' ';margin-top: -6rpx;
			transform: rotate(45deg);
			transition: all .1s cubic-bezier(.71,-.46,.88,.6);
		}
	}
	&.checked{
		.inner{
			border-color: @theme-color;background-color: @theme-color;
			&::after{ border-color: #fff; transition: all .2s cubic-bezier(.12,.4,.29,1.46) .1s; }
		}
	}
	.info{ font-size: 28rpx;line-height: 28rpx; }
}

/* 底部客服弹窗 */
.contact-box{
	.item{
		height: 106rpx;font-size: 28rpx;border-top: 2rpx solid #eee;padding: 0 40rpx;color: #969696;
		&.nob{border-top: none;}
	}
}

/* 底部优惠券弹窗 */
.uni-popup__wrapper-box{background-color: #fff;}
.popup-coupons{
	max-height: 780rpx;
	.coupon-item{
		height: 170rpx; background-color: #fff6f3;border-radius: 15rpx;margin-bottom: 26rpx; position: relative;
		.left{
			width: 174rpx;height: 100%; border-right: 2rpx dashed rgba(255,197,174,.4);padding-top: 26rpx; position: relative;
			.dis{font-size: 50rpx;}
			.tag{line-height: 36rpx;padding: 0 15rpx;font-size: 20rpx;color: @assist-color; background-color: #ffdccd;border-radius: 15rpx 0 15rpx 0;position: absolute;left: 0;top: 0;}
		}
		.right{ width: calc(100% - 174rpx);height: 170rpx;padding: 20rpx 32rpx;line-height: 40rpx; }
		.get{width: 130rpx;line-height: 45rpx;border-radius: 22rpx;background-color: @assist-color; position: absolute;right: 24rpx;top: 50%;transform: translateY(-50%);}
	}
}
.coupon-empty{
	padding-top: 30rpx;
	.img{display: block;margin: 0 auto; width: 244rpx;height: 124rpx;}
	.txt{padding-top: 80rpx;}
}

/* 字体图标 */
@font-face {
	font-family: "HM-FD-font";
	src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALAAAsAAAAABpQAAAJzAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgp4gQIBNgIkAwwLCAAEIAWEbQc5G8sFERWMIbIfCbbzqA4hp7InSBibVsYGb4J42o82b3e/nJlHMw/NHbGOlwKJRCRpwzPtpAECCOZubdqxjYpQLMlVg+70/08edrgQOtx2ukpVyApZn+dyehPoQObHo3O85rYx9vOjXoBxQIHugW2yIkqIW2QXcScu4jwE8CSWbKSmrqUHFwOaJoCsLM5P4haSGIxRcRHshrUGucLCVcfqI3AZfV/+USguKCwNmtsxVztDxU/n55C+3W0Z4QQpEOTNFqCBbMCAjDUWB9CIwWk87aa70cYgqLkyd3dEmm+18R8eKATEBrV7A5CulBT8dKiWOYZk412XNcDdKSEKSGODnyKIDl+dmVt9/Dx4pu/xyeutkMlHISGPTsPCnoTNP9nOT6wTtDdlO6dPr47efvj942lkYuQzrhMKEjq9N6y98P3340gmlJ/RStUD6F31CAEEPtUW94/7rf+7XgaAz57X0ZHXAGsFFwVgw38yALuMb0IBbVyNamFYEw4oKMDTj3AHRQP5Pt4dci9VwSVkRNQh5r7CLskZadhsWHhRDBsXczk8ZYk3ewnCxmQeQKa3BOHvA8XXO2j+vqRhf7CE+sPmn4anvoL29JLa4qqaUQkmoK+QG2osCckq7txi2leK86aIPyJ3eQZ8xytXYmyQ51jQndJAxIJlqiGSLsOqImiZCjTiZCJt6Lq26U2OoXqwUo0hRaAE0K5AziANy/uLVeXzWyjVqyjcoeupjxDr5MMDn8MDkLG9Aenu5ZrOSSoghAUsRmogkkahSoWAtnlUARnCkY3It0Iu7mWhdmd9Z/19BwBP6GidEi0G56opckXTGZVSPxgAAAA=');
}
.iconfont {
	font-family: "HM-FD-font" !important;
	font-style: normal;
	&.triangle {
		&:before { content: "\e65a"; }
	}
}
